import { HashRouter, Routes, Route, Navigate } from "react-router-dom";
import { lazy, Suspense } from 'react'
const Index = lazy(() => import('../pages/index'));
const Login = lazy(() => import('../login/login'));
const Cart = lazy(() => import('../cart/index'));
const Category = lazy(() => import('../category/category'));
const Product = lazy(() => import('../product/product'));
const Home = lazy(() => import('../pages/page/home'));
const Hook = lazy(() => import('../hook/demo'));
const User = lazy(() => import('../user/user'));
const BasicRoute = () => (
    <HashRouter>
        <Suspense fallback={''}>
            <Routes>
                <Route path="/" element={<Navigate to='/home'></Navigate>}></Route>
                <Route path='/' element={< Index />}>
                    <Route path='/home' element={<Home />}></Route>
                    <Route path='/category/:id' element={<Category />}></Route>
                    <Route path='/product/:id' element={<Product />}></Route>
                    <Route path='/cart' element={<Cart />}></Route>
                </Route>
                <Route path='login' element={<Login />}></Route>
                <Route path='hook' element={<Hook />}></Route>
                <Route path='user' element={<User />}></Route>
            </Routes>
        </Suspense>
    </HashRouter>
);
export default BasicRoute;
